<template>
  <a-modal
    title="新增课件"
    :visible="visible"
    @ok="handleOk"
    @cancel="handleCancel"
  >
    <a-form-model
      ref="ruleForm"
      :model="form"
      :rules="rules"
      :label-col="{ span: 6 }"
      :wrapper-col="{ span: 14 }"
    >
      <a-form-model-item label="课件名称" prop="name">
        <a-input v-model="form.name" placeholder="请输入课件名称"></a-input>
      </a-form-model-item>
      <a-form-model-item label="课件描述" prop="desc">
        <a-input v-model="form.desc" placeholder="请输入课件描述"></a-input>
      </a-form-model-item>
      <a-form-model-item label="文件">
        <a-upload-dragger
          name="file"
          :multiple="true"
          action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
          @change="handleChange"
        >
          <p class="ant-upload-drag-icon">
            <a-icon type="inbox" />
          </p>
          <p class="ant-upload-text">请点击上传文件</p>
          <p class="ant-upload-hint">仅支持上传.mp4格式的视频文件</p>
        </a-upload-dragger>
      </a-form-model-item>
    </a-form-model>
  </a-modal>
</template>
  
  <script>
import modalMixins from '@/assets/js/mixins/modalMixins.js'
export default {
  name: 'AddCourse',
  mixins: [modalMixins],
  data() {
    return {
      form: {
        name: '',
        desc: ''
      },
      rules: {
        name: { required: true, message: '请输入课件名称', trigger: 'change' },
        desc: { required: true, message: '请输入课件描述', trigger: 'change' }
      }
    }
  },
  methods: {
    handleChange() {
      console.log(123)
    }
  }
}
</script>
  
  <style>
</style>